//微信登录界面
<template>
    <el-form :model="ruleForm" status-icon :rules="rules" ref="ruleForm" label-width="100px" class="demo-ruleForm">
        <h1>微信扫码界面</h1>
        <i @click="tiao" :class="['diannao','iconfont','icon-erweimajiaobiao']"></i>
        <img src="@/assets/imgs/3.png" alt="" width="200px">
        <h4>二维码失效，请点击刷新二维码</h4>
    </el-form>
</template>

<script> 
import {mapMutations} from 'vuex' 
export default {
    data() {
        return {
            ruleForm: {
                usename: '',
                checkPass: '',
            },
            rules: { }
        };
    },
    methods:{
        ...mapMutations('login',['TIAODX','TIAODXTWO','TIAODXTHREE']),
        tiao(){
            this.TIAODXTHREE()
        },
    }
}
</script>

<style lang="less" scoped>
    .demo-ruleForm {
    background-color: rgba(0,0,0,.3);
    color: #fff;
    width: 400px;
    border-radius: 5px;
    padding: 85px 0px 50px ;
    position: absolute;
    z-index: 10;
    top: 25%;
    right:10%;
    .diannao{
            position: absolute;
            font-size: 50px;
            top: -2px;
            right: -2px;
            cursor: pointer;
        }
    h1 {
        line-height: 1;
        text-align: center;
        margin-bottom: 65px;
    }
    img{
        position: relative;
        left: 50%;
        transform: translateX(-50%);
    }
    h4{
        text-align: center;
    }
}

</style>